<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<meta charset="UTF-8">
		<title>录入学生信息</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<link rel="stylesheet" href="${pageContext.request.contextPath}/layui/css/layui.css"  media="all">
	</head>
	<body>
		
		
		
		<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
	  	<legend>录入学生信息</legend>
		</fieldset>
		<form id="stuInfo_form" class="layui-form layui-form-pane" action="#" method="post">
		  <div class="layui-form-item">
		    <label class="layui-form-label">姓名</label>
		    <div class="layui-input-inline">
		      <input type="text" name="stuName" lay-verify="required" placeholder="输入学生姓名" autocomplete="off" class="layui-input">
		    </div>
		  </div>
		  <div class="layui-form-item">
		    <label class="layui-form-label">学号</label>
		    <div class="layui-input-inline">
		      <input type="text" name="stuId" id="stuName" lay-verify="required" placeholder="输入学生学号" autocomplete="off" class="layui-input">
		    </div>
		  </div>
		  <div class="layui-form-item">
		    <label class="layui-form-label">性别</label>
		    <div class="layui-input-block">
		      <input type="radio" name="stuSex" id="stuSex" value="男" title="男" checked="">
		      <input type="radio" name="stuSex" id="stuSex" value="女" title="女">
		    </div>
		  </div>
		  <div class="layui-form-item">
		    <div class="layui-inline">
		      <label class="layui-form-label">手机号</label>
		      <div class="layui-input-inline">
		        <input type="tel" name="stuTell" id="stuTell" lay-verify="required|phone" autocomplete="off" class="layui-input">
		      </div>
		    </div>
		    <div class="layui-inline">
		      <label class="layui-form-label">邮箱</label>
		      <div class="layui-input-inline">
		        <input type="text" name="stuEmail" id="stuEmail" lay-verify="email" autocomplete="off" class="layui-input">
		      </div>
		    </div>
		  </div>
		  <div class="layui-form-item">
		    <label class="layui-form-label">年级</label>
		    <div class="layui-input-inline">
		      <select id="stuGrade" name="stuGrade">
		        <option value="">请选择年级</option>
		        <option value="1" selected="1">大一</option>
		        <option value="2" selected="2">大二</option>
		        <option value="3" selected="3">大三</option>
		      </select>
		    </div>
		    <div class="layui-input-inline">
		      <select id="stuClass" name="stuClass">
		      	<option value="">请选择班级</option>
		      </select>
		    </div> 
		  </div>
		<div class="layui-form-item">
		    <div class="layui-input-block">
		      <button type="button" class="layui-btn" lay-submit="" lay-filter="demo1" id="save_btn">立即提交</button>
		      <button type="reset" class="layui-btn layui-btn-primary">重置</button>
		    </div>
		  </div>		  
		  
		  
		</form>
		<script src="${pageContext.request.contextPath}/js/jquery.js"></script>
		<script src="${pageContext.request.contextPath}/layui/layui.js" charset="utf-8"></script>
		<script>
		$(function(){
			$.get("${pageContext.request.contextPath}/student/getClassNames.do")
				.done(function(result){
					console.log(result);
					if(result.code==100){
						$.each(result.extend.classNames,function(index,name){
							$("#stuClass").append($("<option></option>").attr("name",name).attr("id",++index).append(name));
						});
					}else{
						$("#stuClass").empty();
						$("#stuClass").append($("<option></option>").append("获取失败"));
					}
				});
		});

		
		layui.use(['form', 'layedit', 'laydate'], function(){
		  var form = layui.form
		  ,layer = layui.layer
		  ,layedit = layui.layedit
		  ,laydate = layui.laydate;
		  
		  //日期
		  laydate.render({
		    elem: '#date'
		  });
		  laydate.render({
		    elem: '#date1'
		  });
		  
		  //创建一个编辑器
		  var editIndex = layedit.build('LAY_demo_editor');
		 
		  //自定义验证规则
		  form.verify({
		    title: function(value){
		      if(value.length < 5){
		        return '标题至少得5个字符啊';
		      }
		    }
		    ,pass: [/(.+){6,12}$/, '密码必须6到12位']
		    ,content: function(value){
		      layedit.sync(editIndex);
		    }
		  });
		  
		  //监听提交
		  form.on('submit(demo1)', function(data){
		    return true;
		  });

		});
		
		
		
		$("#save_btn").click(function(){
			console.log($("#stuInfo_form").serialize());
			var stuName=$("#stuName").val();
			var stuId=$("#stuId").val();
			var stuSex=$("#stuSex").val();
			var stuTell=$("#stuTell").val();
			var stuEmail=$("#stuEmail").val();
			var stuGrade=$("#stuGrade").val();
			var stuClass=$("#stuClass").val();
			if(stuName!=""&&stuId!=""&&stuSex!=""&&stuGrade!=""&&stuTell!=""&& stuEmail!=""&&stuClass!=""){
				console.log("ok");
				$.ajax({
					url:"${pageContext.request.contextPath}/admin/saveStu.do",
					type:"post",
					data:$("#stuInfo_form").serialize(),
					success:function(result){
						if(result.code==100){
							//成功
							layer.msg(result.extend.msg, {icon: 1,time:2000});
						}else{
							layer.msg(result.extend.msg, {icon: 5});
						}
					}
				});
			}
			
		});


		
		</script>
	</body>
</html>